{% extends "base.html" %}  
 {% load static %}
{% block head%}
{% endblock %}
{% block content %}
<div>
    <h1 style="width: 100%;text-align: center;font-size: 60px;margin: 30px">新车上市，抢先预约!</h1>
    <div style="width: 90%;margin-left: 5%">
        {% for product in product_list %}
        <img src="/{{ product.img }}" style="width: 100%">
         {% if product.count == 0 %}   
        <div style="width:50%;height:70px;margin-left: 25%;text-align: center;font-size: 40px;background-color: #9f9f9f;margin-bottom: 30px;margin-top: 30px">
            <a style="color: white">暂无名额</a><span style="font-size: 20px">&nbsp&nbsp(剩余{{ product.count }}名额)</span>
        </div>
         {% else %}
         <div style="width:50%;height:70px;margin-left: 25%;text-align: center;font-size: 40px;background-color: #997404;margin-bottom: 30px;margin-top: 30px">
            <a href="javascript:;" id="yysj" data-id="{{ product.id }}" style="color: white">预约试驾</a><span style="font-size: 20px">&nbsp&nbsp(剩余{{ product.count }}名额)</span>
        </div>  
         {% endif %}
        {% endfor %}
        <a href="/flashsale/reservatcar/" style="margin-left: 35%;font-size: 19px;">提交则视为您已同意《预约试乘试驾隐私声明》</a>
    </div>
    <div style="width: 90%;margin-left: 5%;margin-top: 30px">
        {% for image in productimage_list %}
        <img src="/{{ image.images }}" style="width: 100%">
        {% endfor %}
    </div>

</div>
{% endblock %}
{% block script %}
    <script>
        $(document).ready(function(){
            $('#yysj').click(function (){
                var productId = $(this).data('id'); // 使用.data()方法获取data-id的
                $.ajax({
                    url:'/flashsale/addproduct/',
                    type:'get',
                    data:{productId:productId},
                    success:function (response){
                        // 检查响应以确认是否成功，并据此进行重定向  
                        alert(response.message)
                        if (response.message === '参与成功') {
                            window.location.href = '/flashsale/'; // 重定向到'/flashsale/'页面  
                        } 
                    },
                })
            })
        })
    </script>
{% endblock %}